<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>222</title>
		<script src="js/vue.js"></script>
	</head>
	<body>
		<div id="com2">
			<button-counter></button-counter>
			<button-counter></button-counter>
			<button-counter></button-counter>
		</div>
		<script>
			Vue.component('button-counter',{
				//父属性
				props:['abc'],
				data:function(){
					return {
						//组件自己的属性
						count:0
					}
				},
				template:'<button @click="count++">点击了{{count}}次</button>'
			})
			
			//实例化对象
			new Vue({
				el:'#com2'
			})
		</script>
	</body>
</html>
